<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>点我试试</button>
    <script>    
        function fn1(num1,num2){
            console.group('fn1内函数的打印');
            console.log('num1',num1);
            console.log('num2',num2);
            
            console.log('this',this);
            console.groupEnd();

        }

        // fn1(100,200) // 100 200 window

        var obj = {name:'zhangsan',age:18}
        var arrs = [1,3,5,7,9];


        // fn1.call(obj,666,777);

        // fn1.apply(arrs,[888,999]);

        // fn1.bind(obj,666,777);// 这个不会被执行 而是返回一个新的函数 
        // // 只不过这个函数已经被改变了this指向 

        // var test1 = fn1.bind(obj,666,777);

        // test1(); // 需要重新调用这个新函数   跟原函数一样 不过是改了this指向  



        // 我想把 fn1当做 定时处理函数执行  我想让this 指向obj

        // setTimeout setInterval 里的函数 this 指向window

        // setTimeout(fn1(111,222),1000)



        // var test1 = fn1.bind(obj,666,777);
        
        // setTimeout(test1,1000);


        // 事件处理函数的this 指向事件源 

        // button的this 指向 button 我想让他指向数组arrs 

        var btn = document.querySelector('button');
        // btn.onclick = function(){
        //     alert(this);
        // }

        var test2 = fn1.bind(arrs,666,777);
        btn.onclick = test2;

    </script>
</body>
</html>